import 'package:flutter/material.dart';

import '../../../app_views.dart';
/// 功能网格组件 - Feature grid component
/// 
/// 显示应用功能的网格布局
/// Grid layout component for displaying app features
class FeatureGrid extends StatelessWidget {
  final List<FeatureItem> features;
  final Function(FeatureItem)? onFeatureTap;

  const FeatureGrid({
    Key? key,
    required this.features,
    this.onFeatureTap,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          // 标题 - Title
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 4, vertical: 8),
            child: Text(
              '功能导航',
              style: GoogleFonts.notoSansSc(
                fontSize: 18,
                fontWeight: FontWeight.w600,
                color: AppColors.textPrimary,
              ),
            ),
          ),
          const SizedBox(height: 8),
          
          // 功能网格 - Feature grid
          GridView.builder(
            shrinkWrap: true,
            physics: const NeverScrollableScrollPhysics(),
            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 4,
              childAspectRatio: 1.0,
              crossAxisSpacing: 12,
              mainAxisSpacing: 12,
            ),
            itemCount: features.length,
            itemBuilder: (context, index) {
              final feature = features[index];
              return _buildFeatureItem(feature);
            },
          ),
        ],
      ),
    );
  }

  /// 构建功能项 - Build feature item
  Widget _buildFeatureItem(FeatureItem feature) {
    return Container(
      decoration: BoxDecoration(
        color: AppColors.surface,
        borderRadius: BorderRadius.circular(12),
        boxShadow: [
          BoxShadow(
            color: AppColors.shadow.withOpacity(0.1),
            blurRadius: 8,
            offset: const Offset(0, 2),
          ),
        ],
      ),
      child: Material(
        color: Colors.transparent,
        child: InkWell(
          onTap: () => onFeatureTap?.call(feature),
          borderRadius: BorderRadius.circular(12),
          child: Padding(
            padding: const EdgeInsets.all(12),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                // 图标 - Icon
                Container(
                  width: 32,
                  height: 32,
                  decoration: BoxDecoration(
                    gradient: LinearGradient(
                      begin: Alignment.topLeft,
                      end: Alignment.bottomRight,
                      colors: [
                        _getFeatureColor(feature.type).withOpacity(0.8),
                        _getFeatureColor(feature.type).withOpacity(0.6),
                      ],
                    ),
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: Icon(
                    _getFeatureIcon(feature.type),
                    color: AppColors.textLight,
                    size: 18,
                  ),
                ),
                const SizedBox(height: 8),
                
                // 标题 - Title
                Text(
                  feature.title,
                  style: GoogleFonts.notoSansSc(
                    fontSize: 12,
                    fontWeight: FontWeight.w500,
                    color: AppColors.textPrimary,
                  ),
                  textAlign: TextAlign.center,
                  maxLines: 1,
                  overflow: TextOverflow.ellipsis,
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }

  /// 获取功能颜色 - Get feature color
  Color _getFeatureColor(String type) {
    switch (type) {
      case 'calendar':
        return AppColors.primary;
      case 'fortune':
        return AppColors.secondary;
      case 'tools':
        return AppColors.accent;
      case 'study':
        return AppColors.info;
      case 'life':
        return AppColors.success;
      case 'entertainment':
        return AppColors.warning;
      default:
        return AppColors.primary;
    }
  }

  /// 获取功能图标 - Get feature icon
  IconData _getFeatureIcon(String type) {
    switch (type) {
      case 'calendar':
        return Icons.calendar_today;
      case 'fortune':
        return Icons.auto_awesome;
      case 'tools':
        return Icons.build;
      case 'study':
        return Icons.school;
      case 'life':
        return Icons.home;
      case 'entertainment':
        return Icons.games;
      case 'weather':
        return Icons.wb_sunny;
      case 'news':
        return Icons.article;
      case 'music':
        return Icons.music_note;
      case 'video':
        return Icons.play_circle;
      case 'book':
        return Icons.menu_book;
      case 'health':
        return Icons.favorite;
      case 'finance':
        return Icons.account_balance_wallet;
      case 'travel':
        return Icons.flight;
      case 'food':
        return Icons.restaurant;
      case 'shopping':
        return Icons.shopping_cart;
      default:
        return Icons.apps;
    }
  }
}